{% extends "base.html" %}
{% block header %}添加系统参数{% endblock %}
{% block content %}
<div class="container">
    <form method="post">
        {% csrf_token %}
        <div class="mb-3">
            <label for="name" class="form-label">名称</label>
            <input type="text" class="form-control" id="name" name="name">
        </div>
        <div class="mb-3">
            <label for="key" class="form-label">参数名</label>
            <input type="text" class="form-control" id="key" name="key">
        </div>
        <div class="mb-3">
            <label for="type" class="form-label">类型</label>
            <select class="form-select" id="type" name="type" onchange="showOptions(this.value)">
                <option value="1">文本框</option>
                <option value="2">多行文本</option>
                <option value="3">选择框</option>
            </select>
        </div>
        <div class="mb-3" id="options-div" style="display:none;">
            <label for="options" class="form-label">选项（用|分割）</label>
            <input type="text" class="form-control" id="options" name="options" placeholder="如：选项1|选项2|选项3">
        </div>
        <div class="mb-3">
            <label for="value" class="form-label">参数值</label>
            <input type="text" class="form-control" id="value" name="value">
        </div>
        <div class="mb-3">
            <label for="remark" class="form-label">备注</label>
            <input type="text" class="form-control" id="remark" name="remark">
        </div>
        <button type="submit" class="btn btn-primary">保存</button>
    </form>
</div>
<script>
function showOptions(val) {
    document.getElementById('options-div').style.display = (val == '3') ? '' : 'none';
}
</script>
{% endblock %}
